草庐IT

CSS 分页实例

全部标签

javascript - Jquery 在点击时更改 CSS 类

我正在做一个项目,我有一些像选项卡这样的anchor,每个anchor都有一些CSS类,选定的选项卡有单独的css类。我正在单击选项卡,我想将其CSS类更改为选定的css类我已经完成了此功能,但我遇到了一些问题,因为之前选择的选项卡也具有相同的类,我如何才能将之前选择的选项卡更改为未选择类,下面是我的代码$(".btn").each(function(){$(this).click(function(){$(this).removeClass("course-btn-tab").addClass("course-btn-tab-selected");});});ABCD

javascript - 使用 javascript 将一个 CSS 类添加到具有另一个类名的所有元素

我正在尝试使用javascript将一个类添加到具有不同类的所有元素。我知道你可能认为这是多余的,但对于我所处的情况来说,这是需要的。我需要一种方法来查看具有该类名的所有元素并添加该类,但我不明白如何计算?我正在使用cms工作,我不能在它自己的类中更改样式。$(document).ready(function(){varClassBtn=document.getElementsByClassName("buttonSubmit");ClassBtn.className=ClassBtn.className+"btn";}); 最佳答案

javascript - 如何在文档中获取(具有)最高 CSS z-index 的(元素)?

这个问题再简单不过了。z-index值由style=...或className分配,无论是否使用Javascript。我认为这不重要。我如何找到(使用Javascript)最高的z-index?(它所使用的元素会很好,但不是必需的。)您不能使用(新的)querySelector,因为它不查询CSS值。有什么方法可以查询CSS吗?(不是样式表,而是实际使用的值。)格拉兹获取前5个元素+z索引:Array.from(document.querySelectorAll('*')).map(el=>[el,getComputedStyle(el).zIndex]).filter(v=>!isN

javascript - 在 em 中获取 CSS 中定义的元素的宽度

我无法获取CSS中定义的元素的宽度。我想出了如何使用Javascript获取CSS规则,但我无法访问宽度。Menu是我在CSS中使用em定义的固定宽度。我正在尝试根据浏览器窗口减去固定的菜单宽度来更改div1的宽度。注意:我已经尝试使用style.width,但它在控制台中返回了一个空行。jsfiddle:http://jsfiddle.net/kj6pQ/vardiv1=document.createElement('div'),css=getMatchedCSSRules(document.getElementById('menu'));console.log(css);//wor

javascript - CSS 模块不适用于 React 版本 16.6.0

我试图在React中使用CSS模块。这是我的App.js代码importReactfrom'react';importstylesfrom'./index.css'constApp=()=>{constREACT_VERSION=React.version;return(MainappGreenYellowReactversion:{REACT_VERSION});};exportdefaultApp;这是我的index.css代码.test{background:black;color:white;font-size:34px;border:34px;}这是输出我知道我要修改webp

javascript - 使用 CSS(也许还有 JavaScript)使元素成为正方形(或保持特定的纵横比)

我有一个div,我希望它具有以下特征:宽度=其父元素的50%高度等于为保持特定纵横比所需的任何高度。我需要使用百分比,因为当浏览器调整大小时,对象会左右调整大小。我希望对象从上到下调整大小以确保对象保持相同的纵横比。我不认为有任何方法可以使用纯CSS来做到这一点,但是有人知道一种方法吗?或者,是否有一种简单的JavaScript方法可以做到这一点?(JQuery很好。) 最佳答案 虽然您需要使用透明图像,但我想出了如何在没有js的情况下执行此操作。设置一个html结构,如:Yourfavoritecontenthere为rect_i

javascript - jQuery css 回调函数

我正在尝试使用jQuery扩展我的搜索栏。我也想隐藏导航链接。我有一些这样的jQuery代码。此代码在焦点时工作正常。$(".searchBoxinput").focus(function(){$("#navlinks").css('display','none');$(this).css({'width':'200px','-moz-transition':'width0.5sease-out','-webkit-transition':'width0.5sease-out','transition':'width0.5sease-out'});});$(".searchBoxinp

javascript - 如何在 Cloud Functions for Firebase 中访问多个实时数据库实例

我在一个Firebase项目中使用多个数据库。主(默认)数据库的云函数工作得很好,但是,我不能让它们为辅助数据库工作。例如,我想在具有管理员权限的节点上发出读取请求://thisworksadmin.database().ref(nodePath).once('value')...这在主数据库中有效,但是,如果我想在另一个数据库上执行命令,它就不起作用了://thisdoesn'tworkadmin.database(secondaryDatabaseUrl).ref(nodePath).once('value')...虽然部署了功能,但在尝试执行云功能时,控制台出现错误。这是带有ht

javascript - 如何切换外部 CSS 文件?

我有几本关于AJAX的书,但还是很新。所有教程和这些书籍都有无处不在的示例:自动填充搜索栏和异步表单验证器。这些都很棒,但不是我要找的。具体来说,我想单击一个按钮并在我的header包含中切换外部CSS文件。这可能吗?好吧……我知道这是可能的,但你是怎么做到的?PS:我在这个元素中有jQuery,所以如果有内置的东西,那就更好了!PPS:我意识到我没有包含重要信息(不要开枪!):此操作的最终目标是拥有一个用户设置部分,用户可以在其中单击单选按钮并决定他们要为我们的应用程序使用的配色方案。所以我们最终会有8种不同的CSS样式可供选择。不确定这是否会改变实现此目标的最佳方法。用户正在登录他

javascript - 在 Javascript 中获取类的所有实例

我以为这个问题已经有了答案,但我似乎找不到……如何在Javascript中对此类的所有实例运行特定的类方法?这必须在我不知道实例名称的情况下完成。我想我可以在我的类中使用某种静态变量来存储所有实例,但这在JS中似乎不存在那么如何在我的类的所有现有实例上调用我的方法呢?注意:只是为了澄清:我不是在谈论CSS类,而是在谈论对象。编辑:按Javascript中的类,我的意思是在函数上创建一个新对象:functionsomething(){}varinstance=newsomething(); 最佳答案 您可以创建一个静态数组并将其存储在